<template>
  <el-drawer
    title="检验项目"
    :visible.sync="visible"
    :append-to-body="true"
    :before-close="handleClose"
    size="50%">

      <h4 style="margin-left: 16px;">{{ standard.accordingToInside }}</h4>

      <el-table
      	:data="allItems"
        ref="dataTable"
        fit
        highlight-current-row
        @row-click="handleCurrentChange"
        @selection-change="selectionChange"
      	style="width: 100%">
        <el-table-column
          type="selection"
          header-align="center"
          align="center"
          width="50">
        </el-table-column>
        <el-table-column
        	prop="inspectionCategoryName"
        	header-align="center"
        	align="center"
        	label="检验项分类"
          width="100">
        </el-table-column>
        <el-table-column
        	prop="inspectionItemName"
        	header-align="center"
        	align="center"
        	label="检验项名称"
          width="200">
        </el-table-column>
        <el-table-column
        	prop="inspectionGroupName"
        	header-align="center"
        	align="center"
        	label="所属组别"
          width="100">
        </el-table-column>
        <el-table-column
        	prop="insideInspectionItemValue"
        	header-align="center"
        	align="center"
        	label="内控标准值">
          <template slot-scope="{row}">
            <span v-html='row.insideInspectionItemValue'></span>
          </template>
        </el-table-column>
      </el-table>

  </el-drawer>
</template>

<script>
  import {isBlank} from '@/common/js/utils'
  import {CODE_OK} from '@/common/js/config'
  export default {
    data() {
      return {
        visible: false,
        standard: {},
        allItems: [],
        items: [],
        selectionList: []
      }
    },
    props: ["childDataForm"],
    created() {
      if (!isBlank(this.childDataForm)) {
        this.standard = this.childDataForm.standard
        this.allItems = this.childDataForm.allItems
        let checkedItems = this.childDataForm.checkedItems
        if (checkedItems.length != 0) {
          for (let i=0,j=checkedItems.length; i<j; i++) {
            for (let x=0,y=this.allItems.length; x<y; x++) {
              if (checkedItems[i].inspectionItemId == this.allItems[x].inspectionItemId) {
                this.$nextTick(() => {
                	this.checked(x)
                })
              }
            }
          }
        }
        this.visible = true
      }
    },
    mounted() {
      this.$nextTick(() => {
        const body = document.querySelector("body")
        if (body.append) {
          body.append(this.$el)
        } else {
          body.appendChild(this.$el)
        }
      })
    },
    methods: {
      handleCurrentChange(row, event, column){
        this.$refs.dataTable.toggleRowSelection(row,true)
      },
      selectionChange(obj) {
      	this.selectionList = obj
      },
      checked(index) {
      	this.$refs.dataTable.toggleRowSelection(this.allItems[index],true)
      },
      handleClose(done) {
        if (this.selectionList.length == 0) {
          this.$message.error("请选择至少一个检验项")
          return
        }
        const standardObj = {
          checkedItems: this.selectionList,
          isAllTest: this.selectionList.length == this.allItems.length ? 0 : 1
        }
        this.$emit('getStandard', standardObj)
        this.$emit('close')
        done()
      }
    }
  }
</script>

<style>
</style>
